import React,{Suspense} from 'react'
import {BrowserRouter,Routes,Route,Navigate } from 'react-router-dom'
import routes from './routerConfig'

function RouterView() {

  const renderRouter =(arr)=>{
      return arr.map((item,index)=>{
          return item.path ?<Route key={index} path={item.path} element={<item.element></item.element>}>
              {
                  item.children && renderRouter(item.children)
              }
          </Route>:
          <Route key={index} path={item.from} element={<Navigate to={item.to}></Navigate>}></Route>
      })
  }  
  return (
    <Suspense fallback="路由加载中">
        <BrowserRouter>
            <Routes>
                {renderRouter(routes)}
            </Routes>
        </BrowserRouter>
    </Suspense>
  )
}

export default RouterView